import React, { DOMAttributes, FormEventHandler } from "react";

export const LoginScreen = () => {
  const baseUrl = 'http://localhost:3001'
  const login = (param:{username:string, password:string}) => {
    fetch(`${baseUrl}/register`,{
      method:'POST',
      headers:{
        'Content-type':'application/json'
      },
      body:JSON.stringify(param)
    }).then(async response => {
      if(response.ok){
      }
    })
  }

  const handleSubmit = (event:React.FormEvent<HTMLFormElement> | undefined):void => {
    event?.preventDefault()
    const username = (event?.currentTarget.elements[0] as HTMLInputElement).value
    const password = (event?.currentTarget.elements[1] as HTMLInputElement).value
    login({username, password})
  }
  
  return <form onSubmit={handleSubmit}>
    <div>
      <label htmlFor="username">用户名</label>
      <input type="text" id={'username'}/>
    </div>
    <div>
      <label htmlFor="password">密码</label>
      <input type="password" id={'password'}/>
    </div>
    <div>
      <button type={'submit'}>注册</button>
    </div>
  </form>
}